<template>
  <div class="dept-select">
    <el-select v-model="modelValue">
      <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
    </el-select>
  </div>
</template>
<script lang="ts">
export default {
	name: "dept-select"
};
</script>
<script lang="ts" setup>
import { nextTick, onMounted, ref, watch } from "vue";
import { deepTree } from "/@/cool/utils";
import { ElMessage } from "element-plus";
import { useCool } from "/@/cool";
import { useForm } from "@cool-vue/crud";

const props = defineProps({
	modelValue: {
		type: String
	}
});
const options = ref<any[]>([]);
const emit = defineEmits(["update:modelValue"]);

const { service } = useCool();
onMounted(async () => {
	console.log(props.modelValue);
	const list = await service.base.sys.role.list();
	options.value = list.map((e: any) => {
		return {
			label: e.name,
			value: e.id
		};
	});
});
</script>

<style lang="scss" scoped>
</style>
